<template>
  <div>{{ host }}</div>
</template>

<script setup>
// 获取当前页面路由信息
import { useRoute } from "vue-router";
import { HOST_DETAIL } from "@/api/cmdb.js";
import { Message } from "@arco-design/web-vue";
import { onMounted, ref } from "vue";

const route = useRoute();
console.log(route.query.resource_id);

const host = ref(undefined);

onMounted(async () => {
  // 根据路由信息中的resource_id, 与后端交互, 查询主机资源详情
  try {
    const resp = await HOST_DETAIL({ resource_ids: route.query.resource_id });
    let items = resp.data.data.items;
    if (items.length > 0) {
      host.value = items[0];
    }
  } catch (error) {
    Message.error(error);
  }
});
</script>

<style lang="scss" scoped></style>
